<template>	
	<view class="center">
		
		<view class="center-list">
			<view class="center-list-item border-bottom">
				<text class="list-icon">
					<img src="../../static/friend.png" alt="" class="img-icon">
				</text>
				<text class="list-text">朋友圈</text>
				<text>
					<span style="position:relative;">
					<img src="../../static/img/1.jpg" alt="" class="img-icon-person">
					<i></i>
					</span>
				</text>
				<text class="navigat-arrow">&#xe65e;</text>
			</view>
		</view>
		<view class="center-list gap">
			<view class="center-list-item">
				<text class="list-icon">
					<img src="../../static/scan.png" alt="" class="img-icon">
				</text>
				<text class="list-text">扫一扫</text>
				<text class="navigat-arrow">&#xe65e;</text>
			</view>
		</view>
		<view class="center-list gap">
			<view class="center-list-item">
				<text class="list-icon">
					<img src="../../static/see.png" alt="" class="img-icon">
				</text>
				<text class="list-text">看一看</text>
				<text class="navigat-arrow">&#xe65e;</text>
			</view>
		</view>
		<view class="center-list gap">
			<view class="center-list-item">
				<text class="list-icon">
					<img src="../../static/game.png" alt="" class="img-icon">
				</text>
				<text class="list-text">游戏</text>
				<text class="navigat-arrow">&#xe65e;</text>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello'
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.img-icon { 
		height: 22px;
		width: 22px;
		margin-top: 12px;
	},
	.img-icon-person {
		height: 22px;
		width: 22px;
		margin-top: 10px;
	},
	i{
	  display:block;
	  background:#f00;
	  border-radius:50%;
	  width:5px;
	  height:5px;
	  top:0px;
	  right:0px;
	  position:absolute;
	}
</style>
